import React,{Component} from 'react'
import { connect } from "react-redux";
import {NavLink} from 'react-router-dom'
import axios from 'axios'

export default class ContentList extends Component{

    constructor(props){
        super(props);

        this.state = {
            list:[]
        }
    }

    componentWillMount(){
        var cid = this.props.match.params.id;
        axios.post('http://10.31.153.29:3000/news/list', {
            //  _id:cid
                cateId:cid
        })
        .then((res)=>{
            this.setState({
                list: res.data.docs
            })
        })
        
    }
    componentWillReceiveProps(nextProps){
        var cid = nextProps.match.params.id;
        axios.post('http://10.31.153.29:3000/news/list', {
    cateId:cid
        })
        .then((res)=>{
            this.setState({
                list: res.data.docs
            })
        })
    }
    render(){
        var lst = [];
        const list = this.state.list; 
        // for(let i=0;i<list.length;i++){
        //     lst.push(
        //         <div className="panel panel-default" key={i}>
        //         <div className="panel-heading">{list[i].title}</div>
        //         <div className="panel-body">
        //             <p>{list[i].content}</p>
        //         </div>
        //         </div>
        //     )
        // }
        for (let i = 0; i < list.length; i++) {
            lst.push(
              <li className="span4" key={i}>
                <a href="#" className="thumbnail">
                  <h2>{list[i].title}</h2>
                  <h3>{list[i].content}</h3>
                  <p>
                      <NavLink to={`productdetail/${list[i]._id}`} activeClassName="active">进入详情页</NavLink>
                  </p>
                </a>
              </li>
            );
          }
        return (
            <div>
                <ul className="list-group">
                {lst}
                </ul>
            </div>
        )
    }
}

